<template>
    <el-form ref="basicInfoForm" :model="info" :rules="ruleRules" label-width="150px">
        <el-row>
            <el-col :span="12">
                <el-form-item label="数仓名称" prop="dbName">
                    <el-input v-model="info.dbName" placeholder="请输入" @blur="handleChange" />
                </el-form-item>
            </el-col>
            <el-col :span="12">
                <el-form-item label="原型名称" prop="tableName">
                    <el-input v-model="info.tableName" placeholder="请输入" @blur="handleChange('tableName')" />
                </el-form-item>
            </el-col>
            <el-col :span="12">
                <el-form-item label="原型描述" prop="tableComment">
                    <el-input v-model="info.tableComment" placeholder="请输入" @blur="handleChange('tableComment')" />
                </el-form-item>
            </el-col>
            <el-col :span="12">
                <el-form-item label="原型别名" prop="className">
                    <el-input v-model="info.className" placeholder="请输入" @blur="handleChange('className')" />
                </el-form-item>
            </el-col>
            <el-col :span="12">
                <el-form-item label="创建用户" prop="functionAuthor">
                    <el-input v-model="info.functionAuthor" :disabled="true" placeholder="请输入" @blur="handleChange" />
                </el-form-item>
            </el-col>
            <el-col :span="12" style="display: flex">
                <!-- 1 为公开访问 0为用户访问 -->
                <el-form-item label="公开访问" prop="isPublic">
                    <!-- 设置默认为number类型 -->
                    <el-switch v-model="info.isPublic" @change="handleChange" />
                </el-form-item>
                <!-- 1 为严格鉴权 0为宽松鉴权 -->
                <el-form-item label="数据鉴权" prop="isAcl">
                    <!-- 设置默认为number类型 -->
                    <el-switch v-model="info.isAcl" @change="handleChange" />
                </el-form-item>
            </el-col>
            <el-col :span="24">
                <el-form-item label="附加条件" prop="remark">
                    <el-input v-model="info.filterRule" type="textarea" :rows="3" @blur="handleChange"
                        placeholder="这里可以输入自定义的筛选语句 / SQL 语句 WHERE 之后的部分。" />
                </el-form-item>
            </el-col>
            <el-col :span="24">
                <el-form-item label="备注" prop="remark">
                    <el-input v-model="info.remark" type="textarea" :rows="3" @blur="handleChange" />
                </el-form-item>
            </el-col>
        </el-row>
    </el-form>
</template>
<script lang="ts">
import { onMounted, reactive, ref, toRefs } from "vue";
import { updateBasicTable } from '@/api/gen/table';

export default {
    name: 'BasicInfoForm',
    props: {
        info: {
            type: Object,
            default: null,
            // 确保 info 对象中有 isPublic 属性，并且其类型为 number
            props: {
                isPublic: {
                    type: Number,
                    default: 0 // 默认值可以根据需要设置
                }
            }
        },

    },
    setup(props: any) {
        const basicInfoForm = ref();
        const state = reactive({
            ruleRules: {
                tableName: [
                    { required: true, message: '请输入原型名称', trigger: 'blur' }
                ],
                tableComment: [
                    { required: true, message: '请输入原型描述', trigger: 'blur' }
                ],
                className: [
                    { required: true, message: '请输入原型别名', trigger: 'blur' }
                ],
                functionAuthor: [
                    { required: true, message: '请输入创建用户', trigger: 'blur' }
                ]
            },
            pageOptions: []
        })


        // 监听表单字段
        const handleChange = (value: any) => {
            if (value = 'tableName') {
                if (!props.info.tableName)
                    return
            }
            if (value = 'tableComment') {
                if (!props.info.tableComment)
                    return
            }
            if (value = 'className') {
                if (!props.info.className)
                    return
            }
            if (value = 'isPublic') {
                if (!props.info.isPublic) {
                    props.info.isAcl = 0
                }
            }


            updateBasicTable(props.info).then((res) => {
            });
        }

        onMounted(() => {

        });
        return {
            basicInfoForm,
            handleChange,
            ...toRefs(state),
        };
    },
}
</script>
